<template>
    <div>
     <ul class="mui-table-view">
		<li class="mui-table-view-cell mui-media" v-for="item in newslist" :key="item.id">
			<router-link :to="'/home/newsinfo/' + item.id">
				<img class="mui-media-object mui-pull-left" :src="item.img_url">
				<div class="mui-media-body">
					<h1>{{ item.title }}</h1>
					<p class='mui-ellipsis'>
                          <span>发表时间:{{ item.add_time }}</span>
                          <span>点击:{{ item.click }}</span>
                     </p>
				</div>
			</router-link>
		</li>
	  </ul>


    </div>
</template>

<script>
    import {Toast} from "mint-ui"

    export default{
        data(){
            return {
                newslist:[
                    {
                        id:1,
                        title:"人民日报：美方单方面发起贸易战没有任何国际法律依据",
                        add_time:"2012-12-12 12:12:12",
                        zhaoyao:"贸易战贸易战贸易战贸易战贸易战贸易战贸易战贸易战",
                        click:1,
                        img_url:"/src/images/newsphoto/1.jpg"
                    },
                    {
                        id:2,
                        title:"教育部治理幼儿园“小学化”：不得提前教小学内容 将严肃追责",
                        add_time:"2012-11-12 15:02:12",
                        zhaoyao:"教育部教育部教育部教育部教育部教育部教育部教育部",
                        click:3,
                        img_url:"/src/images/newsphoto/2.jpg"
                    }
                ]
            }
        },
        // created(){
        //     this.getNewsList();
        // },
        // methods:{
        //     //获取新闻列表
        //     getNewsList(){
        //         this.$http.get('api/getnewslist').then(function(result){
        //             if(result.body.status===0){
        //                 this.newslist=result.body.message;
        //             }else{
        //                 Toast("获取列表失败")
        //             }
        //         })
        //     }
        // }
    }
</script>

<style lang="less" scoped>
.mui-media-body{
    h1{
        font-size: 14px;
    }
    .mui-ellipsis{
        font-size: 12px;
        color: skyblue;
        display: flex;
        justify-content: space-between;
    }
}
</style>
